*{
    margin: 0;
    padding: 0;
}
body{
    background: #453a94;
}
li{list-style: none;}
img{
    width: 320px;
height: 200px;
}
.box{
    width: 1000px;
    height: 320px;
    margin: 200px auto;
    overflow: hidden;
    transition: all .3s;

}
.box li{
   float: left;
position: relative;
width: 200px;
height: 320px;
transition: all .3s;
}
.box li .text{
    position: absolute;
    left: 0;
    bottom: 0;
    font-size: 16px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    width: 100%;background: rgba(0, 0, 0, .3);


}
 .box:hover li{
  width: 64px;
} 
.box li:hover{
    width: 64px;
}  
